<template>
  <div class="dy-main MyWealthTranDetail">
    <div class="dy-header">
      <x-header title="交易详情" :left-options="{preventGoBack:true}" @on-click-back="back"></x-header>
    </div>
    <div class="dy-body">
      <group gutter="0">
        <cell title="交银添利B(T556643424249)" class="bold"></cell>
        <cell title="风险等级" :value="tranData.level"></cell>
        <cell title="交易类型" :value="tranData.type"></cell>
        <cell title="结算账号" :value="tranData.accountNo"></cell>
        <cell title="委托日期" :value="tranData.date"></cell>
        <cell title="委托金额" :value="tranData.money"></cell>
        <cell title="投资期限" :value="tranData.term"></cell>
        <cell title="业绩基准" :value="tranData.benchmark"></cell>
      </group>
      <div class="confirm">
        <x-button action-type="button" @click.native="tipsShow = true">撤单</x-button>
      </div>
      <zx-dialog v-model="tipsShow" title="警告" type="tips" butType="choose" :data="['取消', '确认']" @on-click-no="tipsShow = false" @on-click-yes="clickYes">
        <div slot="body" class="tips">
          您确认要撤销购买此产品吗？
        </div>
      </zx-dialog>
    </div>
    <!--<div class="dy-footer"></div>-->
  </div>
</template>
<script>
export default {
  data () {
    return {
      tranData: {
        level: '五级',
        type: '产品认购',
        accountNo: '6225********8888',
        date: '2018-06-22',
        money: '60.000.00元',
        term: '180天',
        benchmark: 'XXXXXX'
      },
      tipsShow: false // 撤单弹出框
    }
  },
  methods: {
    back () {
      this.$publicFun.goBack(this)
    },
    clickYes () {
      this.$router.push({'name': 'MyWealthRevokeResult'})
    }
  }
}
</script>
<style lang="less">
  .MyWealthTranDetail {
    .dy-body {
      overflow: auto;
      .confirm {
        margin: .8rem auto .62rem;
        padding: 0 .4rem;
        width: 100%;
      }
    }
  }
</style>
